<!DOCTYPE html>
<html lang="en" ng-app="raw">
  <head>
    <title>RAW</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="Keywords"
      content="RAW,visualization,data,design,spreadsheet,interface,vector graphics,SVG,PNG,JSON"
    />
    <meta
      name="Description"
      content="RAW, missing link between spreadsheets and data visualization, by DensityDesign and Calibro, Giorgio Caviglia, Matteo Azzi, Michele Mauri, Giorgio Uboldi, Tommaso Elli"
    />
    <meta
      name="author"
      content="DensityDesign Research Lab and Studio Calibro"
    />

    <!-- Social Networks meta tags -->
    <meta property="og:title" content="RAWGraphs" />
    <meta
      property="og:description"
      content="The missing link between spreadsheets and data visualization."
    />
    <meta
      property="og:image"
      content="https://app.rawgraphs.io/imgs/cover-for-socials.jpg"
    />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:url" content="https://app.rawgraphs.io/" />
    <meta property="og:type" content="article" />

    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@rawgraphs" />

    <script>
      document.write('<base href="' + document.location + '" />');
    </script>

    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/css?family=Karla:400,400italic,700,700italic|Roboto:400,700italic,900italic,500italic,400italic,100italic,300italic,900,700,500,300,100|Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,800,700|Chivo:400,900,400italic,900italic|Pacifico|Dancing+Script:400,700|Cousine:400,700|Arimo:300,400,300italic,400italic,700|Nunito:400,300,700|Oxygen:400,700,300|Lato:100,200,400,700,900&subset=latin,latin-ext"
    />

    <link
      rel="stylesheet"
      href="bower_components/bootstrap/dist/css/bootstrap.min.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="bower_components/angular-bootstrap-colorpicker/css/colorpicker.css"
    />
    <link
      href="https://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css"
      rel="stylesheet"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="bower_components/codemirror/lib/codemirror.css"
    />

    <link rel="stylesheet" href="css/raw.css" />
    <link rel="icon" href="favicon.ico?v=2" type="image/x-icon" />
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  </head>

  <body data-spy="scroll" data-target="#raw-nav">
    <header
      class="navbar navbar-static-top"
      role="navigation"
      id="raw-nav"
      role="banner"
    >
      <div class="container">
        <div class="navbar-header">
          <button
            type="button"
            class="navbar-toggle"
            data-toggle="collapse"
            data-target="#raw-navbar"
          >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span> <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="https://rawgraphs.io/" target="_blank">
            <img alt="RawGraphs" src="imgs/rawgraphslogo.png" />
          </a>
        </div>

        <nav class="collapse navbar-collapse" role="navigation" id="raw-navbar">
          <ul class="nav navbar-nav navbar-right">
            <li>
              <a href="https://rawgraphs.io/about/" target="_blank">About</a>
            </li>
            <li>
              <a href="https://rawgraphs.io/gallery/" target="_blank"
                >Gallery</a
              >
            </li>
            <li>
              <a href="https://rawgraphs.io/learning/" target="_blank"
                >Learning</a
              >
            </li>
            <li>
              <a
                href="https://github.com/densitydesign/raw/wiki/FAQs"
                target="_blank"
                >FAQs</a
              >
            </li>
            <li>
              <a
                href="https://docs.google.com/forms/d/e/1FAIpQLSdfbS0TsyQEXdNfYp9XkiDx5pzwEYfKCmplDJTz1VPAm1R6VA/viewform"
                target="_blank"
                >User survey</a
              >
            </li>
            <li>
              <a
                href="https://github.com/densitydesign/raw/wiki/Developer-Guide"
                target="_blank"
                >Developer Guide</a
              >
            </li>
            <li>
              <a
                href="https://github.com/densitydesign/raw"
                target="_blank"
                style="font-size:23px"
                ><i class="fa fa-github"></i
              ></a>
            </li>
          </ul>
        </nav>

        <!--
          <span class="pull-left">The missing link between spreadsheets and vector graphics</span class="pull-left">
        -->
      </div>
    </header>

    <div ng-view class="wrap"></div>

    <div id="footer">
      <div class="container">
        <div class="row">
          <div class="col-lg-6">
            <p>
              <strong>RAW</strong> is an open source project by
              <a href="https://www.densitydesign.org">DensityDesign Lab</a> and
              <a href="http://calib.ro">Calibro</a>
            </p>
            <p>
              <a href="https://www.giorgiocaviglia.com" target="_blank"
                >Giorgio Caviglia,</a
              >
              <a
                href="https://www.densitydesign.org/person/michele-mauri/"
                target="_blank"
                >Michele Mauri</a
              >, <a href="https://calib.ro" target="_blank">Giorgio Uboldi</a>,
              <a href="https://calib.ro" target="_blank">Matteo Azzi</a>
            </p>
            <p>
              &copy; 2013-2017 (<a
                href="https://raw.github.com/densitydesign/raw/master/LICENSE"
                >Apache License 2.0</a
              >)
            </p>
          </div>
          <div class="col-lg-3 col-md-6 col-sm-6 col-xs-6">
            <p>
              <a href="mailto:hello@rawgraphs.io"
                ><i class="fa fa-envelope breath-right"></i
                >hello@rawgraphs.io</a
              >
            </p>
            <p>
              <a href="https://twitter.com/rawgraphs"
                ><i class="fa fa-twitter breath-right"></i>rawgraphs</a
              >
            </p>
          </div>
          <div class="col-lg-3 col-md-6 col-sm-6 col-xs-6">
            <p>
              <a href="https://github.com/densitydesign/raw"
                ><i class="fa fa-github breath-right"></i>GitHub</a
              >
            </p>
            <p>
              <a
                href="https://groups.google.com/forum/?hl=en#!forum/densitydesign-raw"
                ><i class="fa fa-google breath-right"></i>Google group</a
              >
            </p>
          </div>
        </div>
      </div>
    </div>

    <!-- modal prelaunch indiegogo campaign -->

    <div id="pre-launch-modal" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" data-show="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content" style="
            padding: 5rem;
            background-image: url(https://c1.iggcdn.com/indiegogo-media-prod-cld/image/upload/c_fit,w_auto,g_center,q_auto:best,dpr_2.0,f_auto/k3mwx97nucffyfgztfec);
            background-position: 50% 45%;
            background-size: 220%;
        ">
          <div class="modal-header" style="border: none;">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="
                margin-top: -5rem;
                margin-right: -5rem;
            "><span aria-hidden="true">&times;</span></button>
            <h1 class="modal-title" style="font-weight: bold;">Hello! 👋 👋 👋<br/>Do you like RAWGraphs?</h1>
          </div>
          <div class="modal-body" style="font-size: 1.25rem;">
            <p style="padding-bottom: 0.75rem;">We are soon launching a crowdfunding campaign on Indiegogo, help us improving RawGraphs and keeping it open to anyone.</p>
            <p>👉 <a href="https://www.indiegogo.com/projects/rawgraphs-2-0/coming_soon" target="_blank" style="text-decoration: underline;">Visit the pre-launch page on Indiegogo!</a></p>
          </div>
          <!-- <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div> -->
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

    <!-- jquery -->
    <script
      type="text/javascript"
      src="bower_components/jquery/dist/jquery.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/jquery-ui/jquery-ui.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/jqueryui-touch-punch/jquery.ui.touch-punch.min.js"
    ></script>
    <!-- bootstrap -->
    <script
      type="text/javascript"
      src="bower_components/bootstrap/dist/js/bootstrap.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js"
    ></script>
    <!-- d3 -->
    <script type="text/javascript" src="bower_components/d3/d3.min.js"></script>
    <!-- d3 plugins -->
    <script
      type="text/javascript"
      src="bower_components/d3-voronoi/d3-voronoi.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/d3-hexbin/d3-hexbin.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/d3-sankey/d3-sankey.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/d3-contour/d3-contour.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/d3-box/index.js"
    ></script>
    <!-- codemirror -->
    <script
      type="text/javascript"
      src="bower_components/codemirror/lib/codemirror.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/codemirror/addon/display/placeholder.js"
    ></script>
    <!-- canvastoblob -->
    <script
      type="text/javascript"
      src="bower_components/canvas-toBlob.js/canvas-toBlob.js"
    ></script>
    <!-- filesaver -->
    <script
      type="text/javascript"
      src="bower_components/FileSaver/index.js"
    ></script>
    <!-- zeroclipboard -->
    <script
      type="text/javascript"
      src="bower_components/zeroclipboard/dist/ZeroClipboard.min.js"
    ></script>
    <!-- raw -->
    <script type="text/javascript" src="lib/raw.js"></script>

    <!-- charts -->
    <script src="charts/treemap.js"></script>
    <script src="charts/streamgraph.js"></script>
    <script src="charts/scatterPlot.js"></script>
    <script src="charts/packing.js"></script>
    <script src="charts/clusterDendrogram.js"></script>
    <script src="charts/voronoi.js"></script>
    <script src="charts/alluvial.js"></script>
    <script src="charts/convexHullMultiple.js"></script>
    <script src="charts/hexagonalBinning.js"></script>
    <script src="charts/parallelCoordinates.js"></script>
    <script src="charts/circularDendrogram.js"></script>
    <script src="charts/smallMultiplesArea.js"></script>
    <script src="charts/bumpChart.js"></script>
    <script src="charts/sunburst.js"></script>
    <script src="charts/gantt.js"></script>
    <script src="charts/horizonChart.js"></script>
    <script src="charts/barChart.js"></script>
    <script src="charts/pieChart.js"></script>
    <script src="charts/contourPlot.js"></script>
    <script src="charts/beeswarmPlot.js"></script>
    <script src="charts/boxPlot.js"></script>

    <!-- angular -->
    <script
      type="text/javascript"
      src="bower_components/angular/angular.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-route/angular-route.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-animate/angular-animate.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-sanitize/angular-sanitize.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-strap/dist/angular-strap.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-strap/dist/angular-strap.tpl.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-ui/build/angular-ui.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/angular-bootstrap-colorpicker/js/bootstrap-colorpicker-module.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/ng-file-upload/ng-file-upload.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/is_js/is.min.js"
    ></script>
    <script
      type="text/javascript"
      src="bower_components/js-xlsx/dist/xlsx.full.min.js"
    ></script>

    <script src="js/app.js"></script>
    <script src="js/services.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filters.js"></script>
    <script src="js/directives.js"></script>

    <!-- google analytics -->
    <script src="js/analytics.js"></script>

    <!-- open pre-launch-modal -->
    <script type="text/javascript">
        $('#pre-launch-modal')
            // .modal({'backdrop', 'static'})
            .modal('toggle')
    </script>
  </body>
</html>
